<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>视屏详情</title>
    <link type="text/css" rel="stylesheet" href="css/common.css">
    <link type="text/css" rel="stylesheet" href="css/detail-style.css">
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/detail.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
</head>
<body>
    <!--登入-->
    <div class="login hide">
    <div class="base-login">
        <span class="login-close">x</span>
        <form action="" method="post" class="login-form">
            <table>
                <tr>
                    <td colspan="2">登入</td>
                </tr>
                <tr>
                    <td class="right-align">账号：</td>
                    <td class="left-align"><input type="text" name="username" class="username"></td>
                </tr>
                <tr>
                    <td class="right-align">密码：</td>
                    <td class="left-align"><input type="password" name="password" class="password"></td>
                </tr>
                <tr>
                    <td colspan="2">
                        <button class="login-button" type="submit" >登入</button>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
    <!--注册-->
    <div class="register hide">
    <div class="base-register">
        <span class="register-close">x</span>
        <form action="" method="post" class="register-form">
            <table>
                <tr>
                    <td colspan="2">注册</td>
                </tr>
                <tr>
                    <td class="right-align">账号：</td>
                    <td class="left-align"><input type="text" name="username" class="username"></td>
                </tr>
                <tr>
                    <td class="right-align">密码：</td>
                    <td class="left-align"><input type="password" name="password" class="password"></td>
                </tr>
                <tr>
                    <td class="right-align">确认密码：</td>
                    <td class="left-align"><input type="password" name="repassword" class="password"></td>
                </tr>
                <tr>
                    <td colspan="2">
                        <button class="register-button" type="submit" >注册</button>
                    </td>
                </tr>
            </table>
        </form>
    </div>
</div>
    <!--头-->
    <div class="top">
        <!--头广告-->
        <div class="announcement">
            <div class="bg">
                <div class="word-bg">
                    <div class="word">北风网和苏州大学深度合作</div>
                    <div class="word">北风大数据培训正式落户苏大</div>
                    <div class="word">零基础大数据课程火热报名中</div>
                    <div class="word">北风网和苏州大学深度合作</div>
                    <div class="word">北风大数据培训正式落户苏大</div>
                    <div class="word">零基础大数据课程火热报名中</div>
                    <div class="word">北风网和苏州大学深度合作</div>
                    <div class="word">北风大数据培训正式落户苏大</div>
                    <div class="word">零基础大数据课程火热报名中</div>
                </div>
            </div>
        </div>
        <!--导航栏-->
        <div class="base">
            <div class="base-navi">
            <a href="index.html" class="navi-logo float-left">
                <img src="images/logo_03.png" >
            </a>
            <p class="nine float-left">
                <img src="images/nineYears_02.png">
            </p>
            <div class="navi">
                <ul>
                    <li>
                        <a href="index.html">首页</a>
                    </li>
                    <li>
                        <a href="course.html">所有课程</a>
                    </li>
                    <li>
                        <a href="index.html">就业课程</a>
                    </li>
                    <li>
                        <a href="bbs.html">学员社区</a>
                    </li>
                    <li>
                        <a href="index.html">线下校区</a>
                    </li>
                    <li>
                            <span class="tel">
                                咨询电话：400-0186-216
                            </span>
                    </li>
                </ul>
            </div>
            <!--登入和搜索-->
            <div class="float-right">
                <!--<div class="search float-left">-->
                    <!--<form action="" method="get">-->
                        <!--<input type="text" name="searchMessage" placeholder="请输入搜索内容">-->
                        <!--<button type="submit" style="border: none;background: none;">-->
                            <!--<img src="images/search-move_06.png" style="height: 15px;width: 15px">-->
                        <!--</button>-->
                    <!--</form>-->
                <!--</div>-->
                <a class="phone-icon float-left">
                    <img src="images/phone-icon_05.png">
                </a>
                <a class="weixin-icon float-left">
                    <img src="images/weixin-icon_01.png">
                </a>
                <div class="user-icon float-left">
                    <img src="images/user-icon_07.png">
                </div>
            </div>
        </div>
    </div>
    </div>
    <!--个人信息-->
    <div class="user">
        <div class="no-login hide">
            <span class="user-login">登入</span><br>
            <span class="user-register">注册</span>
        </div>
        <div class="is-login hide">
            <span>欢迎XXXX</span><br><br>
            <a href="person.html">个人中心</a><br>
            <a href="">注销登入</a>
        </div>
    </div>
    <!--简介-->
    <div class="summary">
        <div class="base-summary">
            <div class="float-left image">
                <img src="images/553_G_1480756234058.jpg" style="max-width: 100%;max-height: 100%">
            </div>
            <div class="float-left info">
                <h1 class="movie-title">这是视屏的标题</h1>
                <h3 class="movie-summary">这是视屏的简介</h3>
                <a href="#" class="watch">观看视屏</a>
            </div>
        </div>
    </div>
    <!--详情-->
    <div class="detail">
        <div class="base-detail">
            <div class="title">
                <span>课程详情</span>
            </div>
            <div class="detail-msg">
                <p>
                    <img src="images/课程背景.jpg" style="width: 100%">
                </p>
                <p class="beijing">课程背景</p>
                <p>
                    <img src="images/讲师介绍.jpg" style="width: 100%">
                </p>
                <p class="jieshao">讲师介绍</p>
                <p>
                    <img src="images/课程大纲.png" style="width: 100%">
                </p>
                <p class="dagang">课程大纲</p>

            </div>
        </div>
    </div>
    <!--末尾-->
    <div class="bottom">
        <div class="base-bottom">
            <!--页脚-->
            <div class="base-footer">
                <div class="footer">
                    <span style="font-size: 16px">友情链接</span>
                    <div class="link">
                        <a href="#">链接1</a>
                        <a href="#">链接2</a>
                        <a href="#">链接3</a>
                        <a href="#">链接4</a>
                        <a href="#">链接5</a>
                    </div>
                    <div class="links">
                        <span class="sub-links float-left">
                            <b>关于我们</b><br>
                            <a>内容1</a><br>
                            <a>内容2</a><br>
                            <a>内容3</a><br>
                            <a>内容4</a>
                        </span>
                        <span class="sub-links float-left">
                            <b>联系我们</b><br>
                            <a>内容1</a><br>
                            <a>内容2</a><br>
                            <a>内容3</a><br>
                            <a>内容4</a>
                        </span>
                        <span>
                            <b>售前客服</b><br>
                            <span style="font-size: 22px">0580-1234567</span><br>
                            <b>售后客服</b><br>
                            <span style="font-size: 22px">0580-1234567</span>
                        </span>
                    </div>
                </div>
            </div>
            <!--copyright-->
            <div class="copyright">

            </div>
        </div>
    </div>
</body>
</html>